<script setup lang="ts">
import { ref,onMounted } from 'vue'
import axios from 'axios'
import type { MerchantAccount } from '@/type/merchantAccount.ts'

const Admins=ref<MerchantAccount[]>([])
const updatecenterDialogVisible = ref(false);
const tableData = ref<MerchantAccount[]>([])
const remark=ref('')


onMounted(()=>{
  axios.post('http://localhost:8080/admin/selectThroughByStatus').then(res=>{
    console.log(res.data)
    Admins.value=res.data.data

  })
})

const openUpdateDialog = (row:any) => {
  console.log(row);
  tableData.value = row;
  remark.value = row.remark || '';
  console.log(tableData.value.userTouxiang);
  console.log(tableData.value);
  updatecenterDialogVisible.value = true;
}
const submit=()=>{
  console.log(tableData.value);
  axios.post('http://localhost:8080/examine/merchant',tableData.value).then(res=>{
    if (res.data.code===200){
      alert('修改成功')
      updatecenterDialogVisible.value = false
      axios.get('http://localhost:8080/admin/selectAllByStatus').then(res=>{
        Admins.value=res.data.data
      })
    }
  })
}

</script>

<template>
  <el-table :data="Admins" style="width: 100%">
    <el-table-column prop="id" label="编号" />
    <el-table-column prop="username" label="账户名" />
    <el-table-column prop="merchantName" label="店铺名" />
    <el-table-column prop="applyTime" label="提交时间" />
    <el-table-column prop="isExamine" label="审核状态" />
    <el-table-column label="操作" width="150px">
      <template #default="scope">
        <el-button size="small" type="primary" @click="openUpdateDialog(scope.row)">
          详情
        </el-button>
      </template>
    </el-table-column>
  </el-table>
  <el-dialog class="shop-dialog" v-model="updatecenterDialogVisible" title="Warning">
    <template #header>
      <span>详情</span>
    </template>
    <template #default>
      <el-form label-width="100px" :model="tableData">
        <el-form-item label="账号">
          <el-input v-model="tableData.username" disabled />
        </el-form-item>
        <el-form-item label="用户头像"
        >
          <el-image
              style="cursor: pointer; width: 100px; height: 100px"
              :src="`http://localhost:9000/img/${tableData.userTouxiang}`"
              :preview-src-list="[`http://localhost:9000/img/${tableData.userTouxiang}`]"
              fit="contain"
              alt="用户头像"
          >
          </el-image>
        </el-form-item>
        <el-form-item label="手机号">
          <el-input v-model="tableData.phone" disabled />
        </el-form-item>
        <el-form-item label="商家介绍">
          <el-input v-model="tableData.username" disabled />
        </el-form-item>
        <el-form-item label="商铺头像">
          <el-input v-model="tableData.touxiang" disabled />
        </el-form-item>
        <el-form-item label="商铺背景图">
          <el-input  v-model="tableData.bg" disabled />
        </el-form-item>
        <el-form-item label="商铺地址">
          <el-input v-model="tableData.username" disabled />
        </el-form-item>
        <el-form-item label="提交审核时间">
          <el-input v-model="tableData.applyTime" disabled />
        </el-form-item>
        <el-form-item label="审核状态" >
          <el-select v-model="tableData.isExamine">
            <el-option
                label="待审核"
                :value="0"
            />
            <el-option
                label="通过"
                :value="1"
            />
            <el-option
                label="不通过"
                :value="2"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="不通过原因" v-if="tableData.isExamine==2">
          <el-input type="textarea" v-model="tableData.remark" />
        </el-form-item>
      </el-form>
    </template>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="updatecenterDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="updatecenterDialogVisible = false;submit()">确认修改</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<style scoped>
</style>
